//定义food的类

class Food{
  //定义一个属性表示食物的对应元素
  element: HTMLElement;

  constructor() {
    this.element = document.getElementById('food')!
  }

  //定义一个获取食物的X坐标的方法
  get X() {
    return this.element.offsetLeft
  }

  //定义一个获取食物的Y左边的方法
  get Y() {
    return this.element.offsetTop
  }

  //定义一个可以改变食物坐标的方法
  change() {
    //因为游戏界面是300*300，食物是10*10，所以食物的左上角的左边最小可以是0，最大是300-10=290（游戏界面宽/高 - 食物的宽/高）
    // 定义两个随机值的left与top变量
    let top = Math.round(Math.random() * 29) * 10
    let left = Math.round(Math.random() * 29) * 10
    // 改变食物的坐标
    this.element.style.left = left + "px"
    this.element.style.top = top + "px"
  }
}

export default Food